<!DOCTYPE HTML>
<html manifest="" lang="en-US">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>LifeDjtu--人在交大</title>
    <link rel="shortcut icon" href="favicon.ico">
    <link rel="stylesheet"  href="res/css/jquery.mobile-1.4.1.css">
    <script src="res/js/jquery.js"></script>
    <script src="res/js/jquery.mobile-1.4.1.js"></script>
    <script type="text/javascript" src="cordova.js"></script>

    <script src="app/util.js"></script>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=DmHHwIyhvBlgLkZKaQmCLN51"></script>

</head>

<body>
<div></div>
<!-- exam page -->
<div data-role="page" id="score-table" data-url="score-table">
    <div data-role="header" data-theme="a" data-position="fixed">
        <h1>
            <br>
            <span class="lead">本部校区</span>
        </h1>
        <div data-role="controlgroup" data-type="horizontal" class="ui-mini ui-btn-left">
            <br>
            <a href="../" data-rel="back"  class="ui-btn ui-shadow ui-corner-all ui-mini ui-btn-inline ui-icon-carat-l ui-btn-icon-left ui-alt-icon ui-nodisc-icon">返回</a>
        </div>

    </div><!-- /header -->
    <div role="main" class="ui-content">
        <div id="panorama"></div>
        <div id="normal_map"></div>
        <style type="text/css">
            .ui-content {width: 100%;height: 100%;overflow: hidden;margin:0;}
            #panorama {height: 50%;overflow: hidden;}
            #normal_map {height:50%;overflow: hidden;}
        </style>
        <script type="text/javascript">
            //全景图展示
            var panorama = new BMap.Panorama('panorama');
            panorama.setPosition(new BMap.Point(120.320032, 31.589666)); //根据经纬度坐标展示全景图
            panorama.setPov({heading: -40, pitch: 6});

            panorama.addEventListener('position_changed', function(e){ //全景图位置改变后，普通地图中心点也随之改变
                var pos = panorama.getPosition();
                map.setCenter(new BMap.Point(pos.lng, pos.lat));
                marker.setPosition(pos);
            });


            //普通地图展示
            var mapOption = {
                mapType: BMAP_NORMAL_MAP,
                maxZoom: 18,
                drawMargin:0,
                enableFulltimeSpotClick: true,
                enableHighResolution:true
            }
            var map = new BMap.Map("normal_map", mapOption);
            var testpoint = new BMap.Point(120.320032, 31.589666);
            map.centerAndZoom(testpoint, 18);
            var marker=new BMap.Marker(testpoint);
            marker.enableDragging();
            map.addOverlay(marker);
            marker.addEventListener('dragend',function(e){
                        panorama.setPosition(e.point); //拖动marker后，全景图位置也随着改变
                        panorama.setPov({heading: -40, pitch: 6});}
            );

        </script>
    </div><!-- /content -->
</div>
</body>

</html>